const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const CopyWebpackPlugin = require("copy-webpack-plugin");

module.exports = {
  entry: {
    index: {
      import: './src/js/index.js',
      dependOn: 'jquery'
    },
    //indexdb: {
    //  import: './src/js/indexdb.js',
    //  dependOn: 'jquery'
    //},
    jquery: 'jquery'  
  },
  output: {
    path: path.resolve(__dirname, '../dist'),
    filename: 'static/js/[name].js',
    assetModuleFilename: 'static/js/[name][ext]?[hash]', //用于导出焦点库和config.js
    clean: true
  },
  module:{
    rules:[
      {
        test: /\.(png|jpg|gif|svg)$/i,
        type: 'asset/resource',
        parser: {
          dataUrlCondition: {
            maxSize: 10 * 1024 //小于10kb的用base64位图
          }
        },
        generator: {
          filename: 'static/image/[name].[contenthash][ext]'
        }              
      },
      {
        test: /\.(htm|html)$/i,
        use: 'html-loader'
      },      
      {
        test: /\.css$/i,
        use: [MiniCssExtractPlugin.loader, 'css-loader']
      },
      {
        test: /\.js$/i,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env'],
            plugins: [
              ['@babel/plugin-transform-runtime']
            ]
          }
        }
      },
    ]
  },
  plugins:[
    new HtmlWebpackPlugin({
      hash:true,
      template:'./src/index.html',
      filename:'index.html',
      inject: 'body',
      minify:{
        removeAttributeQuotes:false,     //删除html中的双引号
        collapseWhitespace:true,    //html文件折叠成一行
        removeComments: true       //除去注释
      }    
    }), 
    new MiniCssExtractPlugin({
      filename: 'static/css/[name].css'
    }),
    new CopyWebpackPlugin({
      patterns: [
        {
          from: path.resolve(__dirname, "../src/static/js/config.js"),
          to: "static/js/[name].js",
        }                       
      ]  
    })
  ],
  resolve: {
    alias: {
       '@': path.resolve(__dirname, "../src"),
    },
  } 
}